<script>
import { ElNotification } from 'element-plus'
import { useLoginStore } from '@/stores/login';
const loginStore = useLoginStore();

export default {
  name: 'Login',
  data() {
    return {
      username: '',
      password: ''
    }
  },
  methods: {
    handle() {
      console.log( this.username,this.password);
      if( 'huzhijie' != this.username) {
        ElNotification({ type: 'warning' ,title: '登录失败', message: '登录名称错误' })
        return;
      }
      if( '197833' != this.password) {
        ElNotification({ type: 'warning' ,title: '登录失败', message: '登录密码错误' })
        return;
      }
      //用useLoginStore 中的action 将用户名保存起来
      loginStore.signIn(this.username);
      //编程式导航到`pc/mine`
      //this.$router.push('/pc/mine');
      this.$router.push({ name: 'pcMine' })
    }
  }
}
</script>
<template>
      <el-form label-position="top" class="wrapper">
        <el-form-item label="登录名称">
          <el-input v-model="username" />
        </el-form-item>
        <el-form-item label="登录密码">
          <el-input type="password" v-model="password" />
        </el-form-item>
        <el-button type="primary" @click="handle">登录</el-button>
      </el-form>
</template>

<style scoped>
.wrapper {
  margin: 15px;
  border: 1px solid green;
  height: 360px;
}
</style>